<template>
	<section id="kline">
		<header>
			<van-icon name="arrow-left" @click="go_back()" /> <span>{{code.toUpperCase()}}</span>
		</header>
		<div style="height: 12.8vw;"></div>
		<iframe :src="iframeurl+code" width="100%" height="460vw"></iframe>
		<section class="contents">
		<van-tabs swipeable>
		  <van-tab v-for="(v,index) in footerList.nav" :title="v" :key="index">
		  	<section v-show="index == 0" class="Clinch">
		  		<nav>
		  			<span>时间</span>
		  			<span>方向</span>
		  			<span>价格</span>
		  			<span>数量</span>
		  		</nav>
		  		<ul class="data_warp">
		  			<li v-for="(v,index) in footerList.list" class="list" :key="index">
		  				<span>{{v.time}}</span>
		  				<span>{{v.type}}</span>
		  				<span>{{v.price}}</span>
		  				<span>{{v.num}}</span>
		  			</li>
		  		</ul>
		  	</section>
		   <section v-show="index == 1" class="Introduction">
			   	<div class="title">{{footerList.introduction_list[0].title}}</div>
					<ul class="lis_warp">

						<li class="lis">
							<span class="name">发行时间</span>
							<span class="mation">{{footerList.introduction_list[0].time}}</span>
						</li>
						<li class="lis">
							<span class="name">发行总量</span>
							<span class="mation">{{footerList.introduction_list[0].all}}</span>
						</li>
						<li class="lis">
							<span class="name">流通总量</span>
							<span class="mation">{{footerList.introduction_list[0].ltall}}</span>

						</li>
						<li class="lis">
							<span class="name">众筹价格</span>
							<span class="mation">{{footerList.introduction_list[0].price}}</span>

						</li>
						<li class="lis">
							<span class="name">白皮书</span>
							<span class="mation">{{footerList.introduction_list[0].book}}</span>
						</li>
						<li class="lis">
							<span class="name">官网</span>
							<span class="mation">{{footerList.introduction_list[0].http}}</span>
						</li>
					</ul>
					<div class="title">简介</div>
					<p class="btb_info">
						是佛山发布搜房司法部搜返回搜房帮是佛山发布搜房司法部搜返回搜房帮是佛山发布搜房司法部搜返回搜房帮
					</p>
	
				</div>
		   	
		   	
		   </section>
		  </van-tab>
		</van-tabs>
			
		</section>
		<div style="height: 7vh;"></div>
		<footer>
			<div class="buy" @click="goUrls(1)">买入</div>
			<div class="sell" @click="goUrls(2)">卖出</div>
		</footer>
	</section>
</template>
<script>
	export default {
		data() {
			return {
				code: null, //k线图code k线图唯一标识
				iframeurl: './static/kLine/k_line.html?code=',
				footerList:{
					nav:['成交','简介'],
					list:[{'time':'2018/01/01','type':'1','price':'100.00','num':'10'},
						{'time':'2018/01/01','type':'1','price':'100.00','num':'10'},
						{'time':'2018/01/01','type':'1','price':'100.00','num':'10'},
						{'time':'2018/01/01','type':'1','price':'100.00','num':'10'},
						{'time':'2018/01/01','type':'1','price':'100.00','num':'10'},
					],
					introduction_list:[{'title':'USDT','time':2007,'all':2000,'ltall':100,'price':200.00,'book':'jsdfsgf','http':'http://www.baidu.com'}]	
				}
				
			};
		},
		methods: {
			//路由返回
			go_back() {
				this.$router.go(-1);
			},
			//各路由跳转
			goUrls(index){
				var _this = this;
				_this.$public.go('jiaoyi',0,_this,{otype:index,name:_this.code});
			}
		},
		created: function() {
			//赋值给code 
			this.code = this.$route.query.id;

		}

	}
</script>